import React, {useState, useEffect} from 'react'
import HomeLeft from '../../components/Home-Left/HomeLeft'
import HomeRight from '../../components/Home-right/HomeRight'
import AdminInfoContext from '../../context/adminInfoContext'
import axios from 'axios'

function Home() {
  const [collapsed, setCollapsed] = useState(false);
  const [AdminInfo,setAdminInfo] = useState({
    avatar: require('./../../assets/1.webp'),
    username: 'Admin'
  })
  const [count,setCount] = useState(0)
  useEffect(()=>{
    axios.get('/api/getAdminInfo').then(data => {
      setAdminInfo({
        avatar: data.data.info.avatar,
        username: data.data.info.username
      })
    })
  },[count])  
  // 数组如果是空数组 说明 只是进入界面执行  不会执行第二次
  // 数组里面如果有数据， 说明 这个数据 发生变化后，effect会再次执行
  // setting设置成功以后， 修改这个数据
  return (
    <AdminInfoContext.Provider value={{AdminInfo,setAdminInfo,count,setCount}}>
      <div className={`flex`}>
        
        <HomeLeft collapsed={collapsed}></HomeLeft>
        <HomeRight collapsed={collapsed} setCollapsed={setCollapsed}></HomeRight>
      </div>
    </AdminInfoContext.Provider>
  );
}

export default Home